<template>
  <div>
    <Nav :title='$route.name'></Nav>
    <div class="contanier">
      <van-form @submit="onSubmit">
    <van-field van-field v-model="text" placeholder="设置个性昵称(不超过20个字符)" clearable
     :rules="[{ pattern:/^[\u4E00-\u9FA5a-zA-Z0-9_-]{4,16}$/, message: '请填写正确格式' }]"
    ></van-field>
      <p class="tips">昵称由中文、英文、数字、-和_组成。</p>
      <div style="margin: 16px;">
    <van-button block type="info" native-type="submit" color="#909090">提交</van-button>
  </div>
      </van-form>
    </div>

  </div>
</template>

<script>
import { fectUserMessage } from '_api'
import { getToken } from '_utils/token.js'
import Nav from '../../components/Nav.vue'
export default {
  data () {
    return {
      text: ''
    }
  },
  methods: {
    onSubmit (params) {
      fectUserMessage({
        nick: this.text,
        token: getToken()
      }).then(res => {
        console.log(res)
      })
    }
  },
  components: { Nav }

}
</script>

<style lang="scss" scoped>
.contanier{
  padding-top: 1.466667rem;
}
.tips{
  padding-left: .4rem;
  margin: .133333rem 0;
  font-size: .32rem;
  color: #999;
}
</style>
